<template>
  <div class="more-container">
    <el-form ref="elForm" :model="formData" size="small" label-width="100px">
      <el-row>
        <el-col :span="4">
          <el-row>
            <el-form-item label-width="0" prop="keyword">
              <el-input v-model="formData.keyword" placeholder="搜索姓名/电话" clearable :style="{ width: '100%' }"></el-input>
            </el-form-item>
          </el-row>
        </el-col>
        <el-col :span="4">
          <el-row>
            <span style="color: #fff">1</span>
          </el-row>
        </el-col>
        <el-col :span="4">
          <el-row>
            <span style="color: #fff">1</span>
          </el-row>
        </el-col>
        <el-col :span="4">
          <el-row>
            <span style="color: #fff">1</span>
          </el-row>
        </el-col>
        <el-col :span="4">
          <el-row>
            <span style="color: #fff">1</span>
          </el-row>
        </el-col>
        <el-col :span="4">
          <el-row>
            <div class="rightbtn fr">
              <el-button type="primary" icon="el-icon-search" size="small" @click="searchlist">
                查询
              </el-button>
              <el-button icon="el-icon-refresh-left" size="small" @click="resetform">
                重置
              </el-button>
            </div>
          </el-row>
        </el-col>
      </el-row>
    </el-form>

    <!-- 表格 -->
    <studenttablehead :tabData="tabData" @handleSizeChange='handleSizeChange' @handleCurrentChange='handleCurrentChange' v-if="issuccess">

      <el-table-column prop="examRecord.count1" label="科一约考" align="center">
        <template slot-scope="scope">
          <span>{{scope.row.examRecord.count1}}次</span>
        </template>
      </el-table-column>
      <el-table-column prop="examRecord.count2" label="科二约考" align="center">
        <template slot-scope="scope">
          <span>{{scope.row.examRecord.count2}}次</span>
        </template>
      </el-table-column>
      <el-table-column prop="examRecord.count3" label="科三约考" align="center">
        <template slot-scope="scope">
          <span>{{scope.row.examRecord.count3}}次</span>
        </template>
      </el-table-column>
      <el-table-column prop="examRecord.count4" label="科四约考" align="center">
        <template slot-scope="scope">
          <span>{{scope.row.examRecord.count4}}次</span>
        </template>
      </el-table-column>
           <el-table-column prop="examRecord.subject" label="最近约考科目" align="center"></el-table-column>
      <el-table-column prop="examRecord.examPlace" label="最近约考场地" width="200" show-overflow-tooltip align="center"></el-table-column>
      <el-table-column prop="examRecord.examTime" label="最近约考时间" width="200" show-overflow-tooltip align="center"></el-table-column>
      <el-table-column prop="subone" label="操作" align="center">
        <template slot-scope="scope">
          <el-link type="primary" :underline='false' class="linkmar" v-if="checkPermission(['studentInputExamHistory'])" @click="entering(scope.row)">录入</el-link>
        </template>
      </el-table-column>
    </studenttablehead>
    <!-- 录入弹窗 -->
    <enteringdialog @confirm='confirm' :dialogparams='dialogparams' :isshowDialog='isshowenter' @closetextDialog='closeenter'></enteringdialog>
  </div>
</template>

<script>
  //录入弹窗
  import enteringdialog from './component/enteringdialog'
  //按钮权限验证
  import checkPermission from '@/utils/permission'
  //api
  import {
    studentList
  } from '@/api/student'
  //表格
  import studenttablehead from '@/components/studenthead'
  export default {
    data() {
      return {
        formData: {
          keyword: undefined,
        },
        tabData: {},
        issuccess:false,
        isshowenter:false,
        //页码
        page:1,
        //一页多少条数据
        total:10,
        //弹窗参数
        dialogparams:{},
      }
    },
    methods: {
      checkPermission,
      //搜索
      searchlist() {
       this.getlistData()
        this.$message({
          type: 'success',
          message: '查询成功!',
        })
      },
      //打开录入弹窗
      entering(val){
        let params = val
        console.log(params)
        this.dialogparams = params
        this.isshowenter = true
      },
      //成绩录入成功
      confirm(){
         this.isshowenter = false
         //刷新列表
         this.getlistData()
      },
      //关闭录入弹窗
      closeenter(){
        this.isshowenter = false
      },
      //翻页 一页有多少条数据
      handleSizeChange(val) {
        this.total = val
        //获取数据
        this.getlistData()
      },
      //翻页码
      handleCurrentChange(val) {
        this.page = val
        //获取数据
        this.getlistData()
      },
      //获取成绩列表
      async getlistData() {
        let params = {
          page: this.page,
          rows: this.total,
          type: 6,
          _request: 6
        }
        if (this.formData.keyword) {
          params.keyword = this.formData.keyword
        }

        let data = await studentList(params)
        console.log(data)
        if (data.code == '0000') {
          this.tabData = data.data
          this.issuccess = true
        }
      },
      //重置
      resetform() {
        this.$message({
          type: 'success',
          message: '已重置!',
        })
        this.$refs['elForm'].resetFields()
      },
    },
    components: {
      studenttablehead,
      enteringdialog
    },
    mounted() {
      //获取列表数据
      this.getlistData()
    }
  }
</script>

<style lang="scss" scoped>
</style>
